<template>
    <!-- 我的地址 -->
    <view class="purchaseDetailContainer">
        <cunstom_navigation_bar :tapEvent="goback" :propStyles="propStyles" :title="'套餐详情'">
        </cunstom_navigation_bar>
		
		<view class="mealList" >
			<view class="mealHead">
				<image :src="imgDomain + packageDetail.image" mode="aspectFill"></image>
				<view class="cookLine">
					<view class="info">
						<view class="txt1">{{ packageDetail.sales}}人已购</view>
					</view>
					<view class="info">
						<view class="txt2">共21道菜</view>
					</view>
				</view>
				
				<view class="fenshu">
					<view class="txt"> 4.9 分</view>
				</view>
			</view>
			<view class="mealContext">
				<view class="line1">
					<view class="item1">{{ packageDetail.name }}/{{ packageDetail.people_max}}位</view>
					<view class="item2">{{ packageDetail.price }}起</view>
					<view class="item3">{{ packageDetail.people_min}}-{{ packageDetail.people_max}}位</view>
				</view>
				<view class="line2">
					{{ packageDetail.desc}}
				</view>	
				<view class="line3">
					<view class="line1" @tap="jumpTo('/page_mealList/cookDetail?id=1')">
						<image src="https://visionmpapi.jiuerjindi.com/upload/mp/cook/topBg.png" mode="aspectFill"></image>
						<view class="item1">安琪</view>
						<view class="item1">21厨龄</view>
						<view class="item2">查看主厨</view>
						<view class="right">
						  <image src="https://visionmpapi.jiuerjindi.com/upload/mp/myInfo/rightIcon.png"></image>
						</view>
					</view>
					<view class="line2"></view>
					<view class="line3" @tap="jumpTo('/page_mealList/cookTime')">
						<image src="https://visionmpapi.jiuerjindi.com/upload/mp/cook/timeIcon.png"></image>
						<view class="item1">查看可服务时间</view>
						<view class="right">
						  <image src="https://visionmpapi.jiuerjindi.com/upload/mp/myInfo/rightIcon.png"></image>
						</view>
					</view>
				</view>	
			</view>
			<view class="lineJcfw">
				<view class="line1">
					<view class="item1">基础服务</view>
					<view class="item2">*该套餐已包含食材</view>
				</view>
				<view class="line2">
					<view class="item1">服务人数</view>
					<view class="item2">{{ packageDetail.people_min}}-{{ packageDetail.people_max}}位</view>
				</view>
				<view class="line3">
					<view class="item1">菜品数</view>
					<view class="item2">21份</view>
				</view>
			</view>
			<view class="lineCpnr">
				<view class="line1">
					<view class="item1">基础服务</view>
				</view>
				<view class="line2">
					<view class="item1">菜品信息</view>
				</view>
			</view>
			<view class="lineZysx">
				<view class="line1">
					<view class="item1">注意事项</view>
				</view>
				<view class="line2">
					<view class="item1">1、请提前48小时联系客服4009965156</view>
				</view>
				<view class="line2">
					<view class="item1">2、此套餐不包含餐后清洁打扫工作。</view>
				</view>
				<view class="line2">
					<view class="item1">3、此套餐菜品可协商更换。</view>
				</view>
				<view class="line2">
					<view class="item1">4、此套餐的常规调料（油盐酱醋糖料酒等）由客户自备。</view>
				</view>
			</view>
			
			<view class="fixBar">
			    <view class="left">
			        <view class="text">预计消费：</view>
			        <view class="sum"><span class="icon">￥</span>{{ packageDetail.price }}<span class="txt">起</span></view>
			    </view>
			
			    <view class="createOrder" @click="createOrder()">
			        <image src="https://visionmpapi.jiuerjindi.com/upload/mp/bookDetail/orderBtn.png"></image>
			    </view>
			</view>
		</view>
    </view>
</template>
<script>
    const util = require("@/utils/util.js");
    const api = require("@/utils/api.js");
    var QQMapWX = require('../utils/qqmap-wx-jssdk.js');
    const mapChange = require('../utils/mapChange.js');

    const app = getApp();
    export default {
        data() {
            return { 
                addrListData: 3, 
                mallProductId: '',
                selectedOption: {},
                openId: "", 
                imgDomain: "", 
                propStyles: {
                    // iconSrc: "../https://visionmpapi.jiuerjindi.com/upload/mp/ucenter/backIcon.png",
                    iconSrc: "black",
                    // bgColor: '#FECF01', 
                },
				packageList:[],
				params:{
					page: 1,
					limit: 20,
					city: '苏州',
					longitude: 120.598346,
					latitude: 31.287181
				},
				id: null,
				cookInfo: null,
				packageDetail: null,
            };
        },
        computed: {

        },
        methods: {
		  changeType(index) {
			console.log('111', this.selectedTypeIndex);
			console.log('222', index);
			if (this.selectedTypeIndex != index) {
			  this.selectedTypeIndex = index
			} else {
			  this.selectedTypeIndex = 999
			}
		  },
            jumpTo(url) {
                uni.navigateTo({
                    url: url,
                })
            },
			selectAddress(id){
				uni.setStorageSync('addressSelect', id); // 存到缓存中
				uni.navigateBack ({
                    url: `/page_bookDetail/bookDetail`,
                })
			},
            goback() {
                console.log("回去");
                uni.navigateBack();
            },
			// 套餐详情
			getPackageDetail(){ 
				console.log("->api.getPackageDetail:"+ api.getPackageDetail);
				let params = {id: this.id};
				util.request(api.getPackageDetail,  params
				  , 'GET', 'application/json').then(res => {
				    if (res.code == 200) {
				      this.packageDetail = res.data;
					  this.getCook(res.data.cook_id);
				    }
				  }).catch((err) => {
				    console.log('err', err)
				
				  }); 
			},
			getCook(id){
				let params = {id: id};
				util.request(api.getCook,params
					, 'GET', 'application/json').then(res => {
					if (res.code == 200) {
					    this.cookInfo = res.data;
							
					} 
				}).catch((err) => {
					console.log('err', err)
					  
				}); 
			},
			
			createOrder(package_id){
				uni.navigateTo({
				    url: '/page_mealList/diningInfo?package_id='+id,
				})
			}

        },
        onReady() { },
        // onShow(){

        //       },
        created() { },
        onShow: function () {

        },



        onLoad: function (option) {

            //option为object类型，会序列化上个页面传递的参数
            // console.log('onload~~~购买页面', option);
            // this.mallProductId = option.mallProductId;
            // this.skuId = option.skuId
            // this.quantity = Number(option.quantity)
            // this.getOrderAddress(option.id)
            // this.startDate = this.getDate()
			
            this.imgDomain = process.env.VUE_APP_BASE_URL;
			this.id = option.id;
			this.getPackageDetail();
        },

    };
</script>
<style lang="scss">
    page {
        height: 100vh;
        overflow: auto;
        background: #F4F4F2;
    }
</style>
<style lang="scss" scoped>
    .purchaseDetailContainer {
        background: #f4f4f2;
        box-sizing: border-box;

        /* ::v-deep .companyInfoContainer {
        position: absolute;
        top: 0rpx;
        left: 0rpx;
  
        .navigationBar {
          background: transparent;
        }
      } */
    }
 
  .contentBox {
    margin-top: 28rpx;
	display: flex;
	flex-direction: column;
    align-items: center;
    width: 100%;
    .topBg {
      width: 694rpx;
      height: 294rpx;
      image {
        width: 100%;
		height: 294rpx;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
      }
    }
  }
  
  .mealList {
	  padding: 0rpx 0rpx;
	  width: 100%;
	  display: flex;
	  flex-direction: column;
	  align-items: center;
	  
	  .mealHead{
		  width: 100%;
		  height: 600rpx;
		  background: rgba(0,0,0,0.2);
		  box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0,0,0,0.15);
		  border-radius: 16rpx 16rpx 16rpx 16rpx;
		  position: relative; /* 设置为相对定位，以便内部的绝对定位元素能够相对于它定位 */
		  image {
			  width: 100%;
			  height: 404rpx;
			  border-radius: 16rpx 16rpx 0rpx 0rpx;
		  }
		  .cookLine{
			  position: absolute; 
			  width: 100% ;
			  height: 100rpx;
			  left: 28rpx;
			  top: 484rpx;
			  display: flex; /* 启用Flexbox布局 */
			  flex-direction: row; /* 子元素沿水平方向排列（默认为row） */
			  justify-content: space-between; /* 子元素间的间隔均匀分布，首尾元素贴近边缘（可根据需要调整） */
			  align-items: center; /* 子元素在垂直方向上居中对齐（若需要） */
			  .info{
				  flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
				  height: 100%; /* 子元素高度与容器一致 */
				  display: flex; /* 启用Flexbox布局 */
				  align-items: center; /* 子元素在垂直方向上居中对齐（若需要） */
				  .cookInfo{
				  	width: 274rpx;
				  	height: 100rpx;
				  	border-radius: 0rpx 0rpx 0rpx 0rpx;
				  	display: flex; /* 启用Flexbox布局 */
				  	flex-direction: row; /* 子元素沿水平方向排列（默认为row） */
				  	justify-content: space-between; /* 子元素间的间隔均匀分布，首尾元素贴近边缘（可根据需要调整） */
				  	align-items: center; /* 子元素在垂直方向上居中对齐（若需要） */
				  	.item{
				  		flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
				  		height: 100%; /* 子元素高度与容器一致 */
				  		text-align: center; /* 文字居中显示 */
				  		line-height: 100rpx; /* 行高与容器高度一致，实现垂直居中 */
				  		box-sizing: border-box; /* 包含内边距和边框在内计算元素宽度 */
				  		margin: 0rpx; /* 子元素间的水平间距（首尾元素除外，因使用了space-between） */
				  		font-family: OPPOSans, OPPOSans;
				  		font-weight: 500;
				  		font-size: 24rpx;
				  		color: #FFFFFF;
				  		line-height: 50rpx;
				  		font-style: normal;
				  		text-transform: none;
				  		 /* 文字垂直居中的关键 */
				  		display: flex; /* 将.item也设为Flex容器 */
				  		align-items: center; /* 使子元素（在这里是文字）在垂直方向上居中对齐 */
				  		justify-content: center; /* 如果需要，也可以使文字在水平方向上居中对齐 */
				  				  
				  		image{
				  			width: 100rpx;
				  			height: 100rpx;
				  			border-radius: 45rpx 45rpx;
				  		}
				  	}
				  }
				  .txt1{
					 width: 118rpx;
					 height: 50rpx;
					 font-size: 24rpx;
					 color: #FFFFFF;
					 margin-left: 0rpx;
					 margin-right: auto;
					 font-family: OPPOSans, OPPOSans;
					 display: flex;
					 align-items: center;
					 justify-content: center; 
					 background: rgba(0,0,0,0.5);
					 border-radius: 16rpx 16rpx 16rpx 16rpx;
				  } 
				  .txt2{
					 width: 118rpx;
					 height: 50rpx;
					 font-size: 24rpx;
					 color: #FFFFFF;
					 margin-left: auto;
					 margin-right: 50rpx;
					 font-family: OPPOSans, OPPOSans;
					 display: flex;
					 align-items: center;
					 justify-content: center; 
					 background: rgba(0,0,0,0.5);
					 border-radius: 16rpx 16rpx 16rpx 16rpx;
				  } 
			  }
		  }
		  .fenshu {
			  position: absolute; 
			  width: 142rpx;
			  height: 54rpx;
			  right: 0; /* 靠右对齐 */
			  top: 402rpx;
			  border-radius: 45rpx 0rpx 0rpx 45rpx;
			  background: linear-gradient( 90deg, rgba(254,207,1,0.8) 0%, rgba(217,63,17,0.8) 100%);
			  .txt{
				  height: 100%; /* 子元素高度与容器一致 */
				  font-size: 32rpx;
				  color: #FFFFFF;
				  font-family: OPPOSans, OPPOSans;
				  display: flex;
				  align-items: center;
				  justify-content: center;
			  }
		  }
	  }
	  .mealContext{
		  width: 100%;
		  height: 580rpx;
		  background: #FFFFFF;
		  box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0,0,0,0.15);
		  border-radius: 0rpx 0rpx 16rpx 16rpx;
		  margin-bottom: 28rpx;
		  display: flex;
		  flex-direction: column;
		  align-items: center;
		  .line1{
			  width: 100%;
			  height: 50rpx;
			  padding-left: 25rpx;
			  padding-right: 25rpx;
			  margin-top: 28rpx;
			  display: flex; /* 启用Flexbox布局 */
			  flex-direction: row; /* 子元素沿水平方向排列（默认为row） */
			  display: flex; /* 启用Flexbox布局 */
			  align-items: center; /* 子元素在垂直方向上居中对齐（若需要） */
			  .item1{
				  width: 252rpx;
				  height: 50rpx;
				  font-family: OPPOSans, OPPOSans;
				  font-weight: 500;
				  font-size: 36rpx;
				  color: #333333;
				  line-height: 50rpx;
				  text-align: left;
				  font-style: normal;
				  text-transform: none;
			  }
			  .item2{
				  width: 144rpx;
				  height: 50rpx;
				  margin-left: 10rpx;
				  font-family: OPPOSans, OPPOSans;
				  font-weight: 500;
				  font-size: 32rpx;
				  color: #D93F11;
				  line-height: 50rpx;
				  text-align: left;
				  font-style: normal;
				  text-transform: none;
				  display: flex; /* 将.item也设为Flex容器 */
				  align-items: center; /* 使子元素（在这里是文字）在垂直方向上居中对齐 */
				  justify-content: center; /* 如果需要，也可以使文字在水平方向上居中对齐 */
			  }
			  .item3{
				  width: 96rpx;
				  height: 32rpx;
				  margin-left: 10rpx;
				  background: #F9F5E6;
				  border-radius: 8rpx 8rpx 8rpx 8rpx;
				  font-family: OPPOSans, OPPOSans;
				  font-weight: 400;
				  font-size: 24rpx;
				  color: #D93F11;
				  line-height: 24rpx;
				  text-align: left;
				  font-style: normal;
				  text-transform: none;
				  display: flex; /* 将.item也设为Flex容器 */
				  align-items: center; /* 使子元素（在这里是文字）在垂直方向上居中对齐 */
				  justify-content: center; /* 如果需要，也可以使文字在水平方向上居中对齐 */
			  }
		  }
		  .line2{
			  width: 100%;
			  height: 80rpx;
			  padding-left: 25rpx;
			  padding-right: 25rpx;
			  margin-top: 28rpx;
			  font-family: OPPOSans, OPPOSans;
			  font-weight: 400;
			  font-size: 28rpx;
			  color: rgba(51,51,51,0.6);
			  line-height: 40rpx;
			  text-align: left;
			  font-style: normal;
			  text-transform: none;
		  }
		  .line3{
			  width: 694rpx;
			  height: 304rpx;
			  background: #F5F5F5;
			  border-radius: 20rpx 20rpx 20rpx 20rpx;
			  display: flex;
			  margin-top: 50rpx;
			  flex-direction: column;
			  align-items: center;
			  .line1{
				  width: 100%;
				  height: 132rpx;
				  margin-top: 16rpx;
				  display: flex; /* 启用Flexbox布局 */
				  flex-direction: row; /* 子元素沿水平方向排列（默认为row） */
				  align-items: center; /* 子元素在垂直方向上居中对齐（若需要） */
				  image{
					  width: 132rpx;
					  height: 132rpx;
					  border-radius: 66rpx 66rpx;
				  }
				  .item1{
					  width: auto;
					  margin-left: 20rpx;
					  font-family: OPPOSans, OPPOSans;
					  font-weight: 500;
					  font-size: 30rpx;
					  color: #333333;
					  line-height: 50rpx;
					  text-align: left;
					  font-style: normal;
					  text-transform: none;
				  }
				  .item2{
					  width: auto;
					  margin-left: auto;
					  margin-right: 28rpx;
					  font-family: OPPOSans, OPPOSans;
					  font-weight: 500;
					  font-size: 30rpx;
					  color: #333333;
					  line-height: 50rpx;
					  text-align: left;
					  font-style: normal;
					  text-transform: none;
				  }
				  .right{
					  width: 22rpx;
					  height: 22rpx;
					  image{
						  width: 22rpx;
						  height: 22rpx;
					  }
				  }
			  }
			  .line2{
				  width: 647rpx;
				  height: 0rpx;
				  margin-top: 50rpx;
				  border: 2rpx solid #D8D8D8;
			  }
			  .line3{
			  	width: 100%;
			  	height: 48rpx;
			  	margin-top: 32rpx;
			  	display: flex; /* 启用Flexbox布局 */
			  	flex-direction: row; /* 子元素沿水平方向排列（默认为row） */
			  	align-items: center; /* 子元素在垂直方向上居中对齐（若需要） */
				image{
					width: 48rpx;
					height: 48rpx;
					margin-left: 24rpx;
				}
				.item1{
					width: auto;
					font-family: OPPOSans, OPPOSans;
					font-weight: 500;
					font-size: 28rpx;
					margin-left: 28rpx;
					color: #333333;
					line-height: 50rpx;
					text-align: left;
					font-style: normal;
					text-transform: none;
				}
				.right{
					  width: 22rpx;
					  height: 22rpx;
					  margin-left: auto;
					  margin-right: 52rpx;
					  image{
						  width: 22rpx;
						  height: 22rpx;
					  }
				}
			 }
		  }
	  }
  
	  .lineJcfw{
		  width: 100%;
		  height: 304rpx;
		  background: #FFFFFF;
		  box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0,0,0,0.15);
		  border-radius: 0rpx 0rpx 16rpx 16rpx;
			.line1{
				width: 100%;
				margin-top: 58rpx;
				padding-left: 28rpx;
				padding-right: 28rpx;
				display: flex; /* 启用Flexbox布局 */
				flex-direction: row; /* 子元素沿水平方向排列（默认为row） */
				justify-content: space-between; /* 子元素间的间隔均匀分布，首尾元素贴近边缘（可根据需要调整） */
				.item1{
					flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
					width: 144rpx;
					height: 32rpx;
					font-family: OPPOSans, OPPOSans;
					font-weight: 500;
					font-size: 36rpx;
					color: #333333;
					line-height: 32rpx;
					text-align: left;
					font-style: normal;
					text-transform: none;
				}
				.item2{
					flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
					width: 206rpx;
					height: 32rpx;
					margin-right: 0rpx;
					margin-left: auto;
					font-family: OPPOSans, OPPOSans;
					font-weight: 500;
					font-size: 24rpx;
					color: #FF9500;
					line-height: 32rpx;
					text-align: right;
					font-style: normal;
					text-transform: none;
				}
			}
			.line2{
				width: 100%;
				margin-top: 58rpx;
				padding-left: 28rpx;
				padding-right: 28rpx;
				display: flex; /* 启用Flexbox布局 */
				flex-direction: row; /* 子元素沿水平方向排列（默认为row） */
				justify-content: space-between; /* 子元素间的间隔均匀分布，首尾元素贴近边缘（可根据需要调整） */
				.item1{
					flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
					width: 144rpx;
					height: 32rpx;
					font-family: OPPOSans, OPPOSans;
					font-weight: 400;
					font-size: 28rpx;
					color: rgba(51,51,51,0.8);
					line-height: 32rpx;
					text-align: left;
					font-style: normal;
					text-transform: none;
				}
				.item2{
					flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
					width: 206rpx;
					height: 32rpx;
					margin-right: 0rpx;
					margin-left: auto;
					font-family: OPPOSans, OPPOSans;
					font-weight: 500;
					font-size: 28rpx;
					color: #333333;
					line-height: 32rpx;
					text-align: right;
					font-style: normal;
					text-transform: none;
				}
			}
			.line3{
				width: 100%;
				margin-top: 58rpx;
				padding-left: 28rpx;
				padding-right: 28rpx;
				display: flex; /* 启用Flexbox布局 */
				flex-direction: row; /* 子元素沿水平方向排列（默认为row） */
				justify-content: space-between; /* 子元素间的间隔均匀分布，首尾元素贴近边缘（可根据需要调整） */
				.item1{
					flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
					width: 144rpx;
					height: 32rpx;
					font-family: OPPOSans, OPPOSans;
					font-weight: 500;
					font-size: 28rpx;
					color: #333333;
					line-height: 32rpx;
					text-align: left;
					font-style: normal;
					text-transform: none;
				}
				.item2{
					flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
					width: 206rpx;
					height: 32rpx;
					margin-right: 0rpx;
					margin-left: auto;
					font-family: OPPOSans, OPPOSans;
					font-weight: 500;
					font-size: 28rpx;
					color: #333333;
					line-height: 32rpx;
					text-align: right;
					font-style: normal;
					text-transform: none;
				}
			}
	  }
	  .lineCpnr{
		width: 100%;
		height: auto;
		margin-top: 28rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0,0,0,0.15);
		  border-radius: 0rpx 0rpx 16rpx 16rpx;
		.line1{
			width: 100%;
			margin-top: 58rpx;
			padding-left: 28rpx;
			padding-right: 28rpx;
			display: flex; /* 启用Flexbox布局 */
			flex-direction: row; /* 子元素沿水平方向排列（默认为row） */
			justify-content: space-between; /* 子元素间的间隔均匀分布，首尾元素贴近边缘（可根据需要调整） */
			.item1{
				flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
				width: 144rpx;
				height: 32rpx;
				font-family: OPPOSans, OPPOSans;
				font-weight: 500;
				font-size: 36rpx;
				color: #333333;
				line-height: 32rpx;
				text-align: left;
				font-style: normal;
				text-transform: none;
			}
		}
		.line2{
			width: 100%;
			height: 100rpx;
			margin-top: 58rpx;
			padding-left: 28rpx;
			padding-right: 28rpx;
			.item1{
				flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
				width: 144rpx;
				height: 32rpx;
				font-family: OPPOSans, OPPOSans;
				font-weight: 500;
				font-size: 28rpx;
				color: #333333;
				line-height: 32rpx;
				text-align: left;
				font-style: normal;
				text-transform: none;
			}
		}
	  }
	  .lineZysx{
		width: 100%;
		height: auto;
		margin-top: 28rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0,0,0,0.15);
		  border-radius: 0rpx 0rpx 16rpx 16rpx;
		.line1{
			width: 100%;
			margin-top: 58rpx;
			padding-left: 28rpx;
			padding-right: 28rpx;
			display: flex; /* 启用Flexbox布局 */
			flex-direction: row; /* 子元素沿水平方向排列（默认为row） */
			justify-content: space-between; /* 子元素间的间隔均匀分布，首尾元素贴近边缘（可根据需要调整） */
			.item1{
				flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
				width: 144rpx;
				height: 32rpx;
				font-family: OPPOSans, OPPOSans;
				font-weight: 500;
				font-size: 36rpx;
				color: #333333;
				line-height: 32rpx;
				text-align: left;
				font-style: normal;
				text-transform: none;
			}
		}
		.line2{
			width: 100%;
			height: 32rpx;
			margin-top: 28rpx;
			margin-bottom: 28rpx;
			padding-left: 28rpx;
			padding-right: 28rpx;
			.item1{
				flex: 1; /* 子元素平均分配剩余空间（若需不等宽，可分别设置flex值） */
				width: auto;
				height: 32rpx;
				font-family: OPPOSans, OPPOSans;
				font-weight: 500;
				font-size: 26rpx;
				color: rgba(51,51,51,0.8);
				line-height: 32rpx;
				text-align: left;
				font-style: normal;
				text-transform: none;
			}
		}
	}
    .fixBar {
        width: 750rpx;
        height: 158rpx;
		margin-top: 28rpx;
        background: #FFFFFF;
        box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0,0,0,0.15);
        border-radius: 0rpx 0rpx 0rpx 0rpx;
        bottom: 0rpx;
        left: 0rpx;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0rpx 26rpx 0rpx 30rpx;
        .left {
            display: flex;
            align-items: center;
            .text {
                font-weight: 400;
                font-size: 28rpx;
                color: rgba(51, 51, 51, 0.6);
            }
            .sum {
                font-size: 40rpx;
                font-weight: 700;
                color: #D93F11;
                .icon {
                    font-size: 24rpx;
                    font-weight: 700;
                    color: #D93F11;
                }
                .txt {
                    color: #333333;
                    font-size: 24rpx;
                }
            }
        }
        .createOrder {
            image {
                width: 336rpx;
                height: 138rpx;
            }
        }
    }
  }



    ::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
        color: transparent;
    }
</style>